<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>prev+next选择器选择器</title>
		<style>
			
			form{
				padding: 10px;
				border: 1px solid #c0c0c0;
			}
			fieldset{
				width: 300px;
			}
			input{
				margin: 10px 10px;
			}
			
			input[type=button]{
				background-color: #ef5b00;
				color: white;
				height: 30px;
				line-height: 30px;
				text-align: center;
				display: block;
				cursor: pointer;
				font-size: 12px;
				width: 180px;
				font-family: "微软雅黑";
				/*去掉边框的关键代码*/
				border: 0 none;
				
			}
			
			.b{
				border: 2px solid green;
			}
		</style>
	</head>
	<body>
		
		<!--匹配所有紧接在 prev 元素之后的 next 元素 只能找到1个-->
		
		<form>
		  
		  <label class="xyz">姓名：</label>
		  <input name="test"  value="huang" />
		  
		  
		  <input name="name"  value="scott" />
		  
		  
		  <fieldset>
		      <label>年龄：</label>
		      <input name="age" />
		      <br>
		      
		      <label>性别：</label>
		      <input name="sex" />
		 </fieldset>
		 
		 
		 <fieldset>
		 	 <span>年龄：</span>
		 	<input value="34" />
		 </fieldset>
		</form>
		
		生日： <input name="brithday" />
		<br>
		
		<input type="button" onclick="search();" value="==紧接在label后面的input==" />
	</body>
	
	<!--Step1:导入jquery-->
	<script type="text/javascript" src="../../../js/jquery-1.4.1.js" ></script>
	<script>
		function search(){
			var formInput = $(".xyz+input");
			console.log(formInput.length);
			
			formInput.each(function(index,object){
				object.setAttribute("class","b");
				//console.log(object.getAttribute("name"));
			});
		}
	</script>
</html>

<!--
	作者：offline
	时间：2016-05-26
	描述：label+input语法总结：
	
	1：首先input必须在label标签的后面
	2：取且只取第1个input(因为label后面其实可以有多个的input 我们只取第1个 紧接的本质含义) 
-->
